<template>
  <el-container>
    <el-header style="background-color: #545C64; color: #fff; line-height: 60px;">活动管理平台</el-header>
    <el-row>
      <el-col :span="4">
        <el-aside width="100%">
          <el-row class="tac">
            <el-col :span="24">
              <el-menu
                default-active="1"
                :default-openeds="['1', '2']"
                class="el-menu-vertical-demo"
                @open="handleOpen"
                @close="handleClose"
                @select="selectMenu"
                background-color="#545c64"
                text-color="#fff"
                active-text-color="#ffd04b">
                <el-submenu index="1">
                  <template slot="title">
                    <i class="el-icon-location"></i>
                    <span>操作</span>
                  </template>
                  <el-menu-item index="1-1">首页公告</el-menu-item>
                  <el-menu-item index="1-2">手机奖金活动</el-menu-item>
                  <el-menu-item index="1-3">首页Banner</el-menu-item>
                  <el-menu-item index="1-4">测试线路</el-menu-item>
                  <el-menu-item index="1-5">游戏大厅</el-menu-item>
                  <el-menu-item index="1-6">赢家信息</el-menu-item>
                </el-submenu>
                <el-submenu index="2">
                  <template slot="title">
                    <i class="el-icon-location"></i>
                    <span>配置以及同步</span>
                  </template>
                  <el-menu-item index="2-1">服务器同步</el-menu-item>
                  <el-menu-item index="2-2">用户管理</el-menu-item>
                  <el-menu-item index="2-3">FTP管理</el-menu-item>
                  <el-menu-item index="2-4">游戏连接配置</el-menu-item>
                  <el-menu-item index="2-5">活动连接配置</el-menu-item>
                  <el-menu-item index="2-6">游戏标签配置</el-menu-item>
                </el-submenu>
              </el-menu>
            </el-col>
          </el-row>
        </el-aside>
      </el-col>
      <el-col :span="20">
        <el-main>
          <router-view/>
        </el-main>
      </el-col>
    </el-row>
  </el-container>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import { setTimeout } from 'timers'

@Component({
  components: {
  },
  })

export default class Home extends Vue {
  // private loading: boolean = false
  // private noMore: boolean = false

  private async mounted () {
    // this.$alert('success', '999')
    // const { res, err }: any = await quickLogin({ Account: 'b8ashly888', Password: '88888888', MAC: '0101001' })
    // if (err !== null) {
    //   console.log(err)
    //   return
    // }
    // this.$cookies.set('TokenCode', res.data, { expires: 2 })
    // this.$store.dispatch('getUserInfo')
    // console.log(res, err)
  }
  private handleOpen (key: string, keyPath: string): void {
    console.log(key, keyPath)
  }
  private handleClose (key: string, keyPath: string): void {
    console.log(key, keyPath)
  }
  private selectMenu (index: string) {
    switch (index) {
      case '1-1':
        console.log(index)
        this.$router.push('/login')
        break
    }
    this.$message({
      type: 'success',
      message: index
    })
  }
}
</script>

<style lang="less" scoped>
.le-home {
  position: absolute;
  .le-home-carounsel {
    position: fixed;
    top: 0;
    z-index: 1;
  }
  .le-home-load-more {
    margin-top: 2.2rem;
    // transform: translateY(2.2rem);
  }
}
</style>
